import React from "react"
import "./style.less"

export default class HotCityList extends React.Component{
    changeCityHanle(cityName){
        //把城市存本地同时会到上一页
        window.history.back();
        this.props.getCityName(cityName)
        
    }
    render (){
        const city = ['北京市','上海市','深圳市','广州市','杭州市','南京市','苏州市','武汉市','成都市'];
        return (
            <div className="clear">
                <h3 className="locate-title">热门城市</h3>
                {
                    city.map((ele,index) => {
                        return (
                            <div 
                            key={index} 
                            className="locate-city-name hotcity-name"
                            onClick={this.changeCityHanle.bind(this,ele)}
                            >{ele}</div>
                        )
                    })
                }
                <ul className="locate-alphabet">
                    <li>A</li>
                    <li>B</li>
                    <li>C</li>
                    <li>D</li>
                    <li>E</li>
                    <li>F</li>
                    <li>G</li>
                    <li>H</li>
                    <li>I</li>
                    <li>J</li>
                    <li>K</li>
                    <li>L</li>
                    <li>M</li>
                    <li>N</li>
                    <li>O</li>
                    <li>P</li>
                    <li>Q</li>
                    <li>R</li>
                    <li>S</li>
                    <li>T</li>
                    <li>U</li>
                    <li>V</li>
                    <li>W</li>
                    <li>X</li>
                    <li>Y</li>
                    <li>Z</li>
                </ul>
            </div>
        )
    }

} 
